<!-- 有效/在库库存详情 -->
<template>
  <div>    
    <div class="app-container" style="padding: 0">
      <el-table border :data="detailTableData" header-cell-class-name="table-header" style="width: 100%;margin-top: 20px" show-overflow-tooltip>
        <el-table-column label="序号" type="index" width="50"></el-table-column>
        <el-table-column prop="equipmentTypeName" show-overflow-tooltip label="器材名称"></el-table-column>
        <el-table-column prop="warehouseName" show-overflow-tooltip label="所属仓库"></el-table-column>
        <el-table-column prop="batchNo" show-overflow-tooltip label="批次号"></el-table-column>
        <el-table-column prop="stockAmount" show-overflow-tooltip label="数量"></el-table-column>
        <el-table-column prop="stockAmountIn" show-overflow-tooltip label="在库数量"></el-table-column>
      </el-table>

      <!-- 分页DIV -->
      <div style="text-align: right;margin-top: 20px">
        <el-pagination
          background
          @size-change="handleExceptionSizeChange"
          @current-change="handleExceptionCurrentChange"
          :current-page="currentDetailPage"
          :page-sizes="[10, 15, 30]"
          :page-size="detailPageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="detailTotal">
        </el-pagination>
      </div>
    </div>    
  </div>
</template>


<script>
import { getDetailList } from '@/api/warehouse'


export default {
  name: 'StockDetail',
  //父传子第四步：接收变量
  props:['parentEquipmentTypeId','parentWarehouseId'],//接受父级传递的数据（组件在dialog中，需要通过组件属性传递参数值；如果直接使用组件则可以直接获取属性）

  data() {
    return {
      dialogVisible: false,
      replaceDialogVisible: false,
      dialogVisible2: false,
      treeProps: { value: 'id', label: 'name' },
      detailTableData: [],
      currentPage: 1,
      total: 0,
      pageSize: 10,
      currentDetailPage: 1,
      detailTotal: 0,
      detailPageSize: 10      
    }
  },
  mounted() {
    this.getDetailTableData()
  },
  methods: {
    getDetailTableData() {
      //console.log('仓库ID：'+ equipmentTypeId);
      //console.log('器材种类ID：'+this.row.equipmentTypeId);
      //父传子第五步：使用变量
      const param = { page: this.currentPage, rows: this.pageSize, warehouseId: this.parentWarehouseId ,equipmentTypeId: this.parentEquipmentTypeId}
      getDetailList(param).then(res => {
        this.detailTableData = res.resultData
        this.detailTotal = res.total
      })
    },




    //--------------------分割--------------------
    handleSizeChange: function(val) {
      this.pageSize = val
      this.currentPage = 1
      this.getTableData()
    },
    handleCurrentChange: function(val) {
      this.currentPage = val
      this.getTableData()
    },
    handleExceptionSizeChange: function(val) {
      this.detailPageSize = val
      this.currentDetailPage = 1
      this.getDetailTableData()
    },
    handleExceptionCurrentChange: function(val) {
      this.currentPage = val
      this.getDetailTableData()
    },
    
    getTableData() {
      const param = { page: this.currentPage, rows: this.pageSize, checkDetailsId: this.selectDetailData.id }
      Object.assign(param, this.selectDetailData)
      param.isStock = this.selectStock
      getInventoryExceptionList(param).then(res => {
        this.tableData = res.resultData
        this.total = res.total
        if (this.tableData.length == 0) {
          this.dialogVisible = false
          this.getDetailTableData()
        }
      })
    },
    handleExceptionOperateClick(row, tag) {
      this.selectDetailData = row
      if (tag == '处理在库数量异常') {
        this.selectStock = 1
        this.onHandleException(1)
      } else if (tag == '处理在外数量异常') {
        this.selectStock = 0
        this.onHandleException(0)
      }
    },
    handleOperateClick(row, tag) {
      this.selectDetailData.labelId = row.labelId
      const h = this.$createElement
      if (tag == '移库') {
        this.$msgbox({
          title: '提示',
          message: h('p', null, [
            h('div', { style: 'text-align: center' }, '系统自动完成移库操作，本物资的所属仓库从原来仓库变更为本仓库；'),
            h('div', { style: 'text-align: center' }, '请及时将此多出物资放回仓库，确保数据准确；'),
            h('div', { style: 'text-align: center' }, '【这个很重要，系统不再做内外的判断，通过管理的方式控制移库一定是在库的移库】'),
            h('div', { style: 'text-align: center' }, '如果对方已经做报废处理，则系统会自动将对方的报废状态设置为无效；'),
            h('div', { style: 'text-align: center' }, '此操作可确保总体物资数量一致')
          ]),
          showCancelButton: true,
          confirmButtonText: '确定移库',
          cancelButtonText: '取消'
        }).then(action => {
          this.handleException(row, 1)
        })
      } else if (tag == '归还到原仓库') {
        this.$msgbox({
          title: '提示',
          message: h('p', null, [
            h('div', { style: 'text-align: center' }, '请将此物资移出仓库，避免再次扫描到；'),
            h('div', { style: 'text-align: center' }, '并及时归还给原归属仓库；')
          ]),
          showCancelButton: false,
          confirmButtonText: '确定',
          cancelButtonText: '取消'
        }).then(action => {
          // this.handleException(row, 2)
        })
      } else if (tag == '找回') {
        this.$msgbox({
          title: '提示',
          message: h('p', null, [
            h('div', { style: 'text-align: center' }, '请及时依据物资跟踪信息找回物资，'),
            h('div', { style: 'text-align: center' }, '并放入仓库后针对此物资重新盘点；')
          ]),
          showCancelButton: false,
          confirmButtonText: '确定',
          cancelButtonText: '取消'
        }).then(action => {
          this.handleException(row, 4)
        })
      } else if (tag == '标签替换') {
        this.replaceData = row
        this.replaceDialogVisible = true
      } else if (tag == '报废') {
        this.$msgbox({
          title: '提示',
          message: h('p', null, [
            h('div', { style: 'text-align: center' }, '报废处理后仓库物资数量将减少；'),
            h('div', { style: 'text-align: center' }, '如果其他仓库在此之后进行了移库操作；'),
            h('div', { style: 'text-align: center' }, '则系统自动设置此报废无效；')
          ]),
          showCancelButton: true,
          confirmButtonText: '确定报废',
          cancelButtonText: '取消'
        }).then(action => {
          this.handleException(row, 3)
        })
      }
    },
    handleException(row, operType) {
      // 如果是一堆
      const param = {}
      Object.assign(param, row)
      param.operType = operType
      param.isStock = this.selectStock
      if (operType == 5) {
        param.newLabelId = this.newLabelId
      }
      handleInventoryException(param).then(res => {
        // 如果是一对一，则刷新列表，如果是一对多，则退出对话框
        if (this.selectDetailData.labelWay == '1') {
          this.getTableData()
        } else {
          this.dialogVisible2 = false
          this.getDetailTableData()
        }
      })
    },
    onHandleException() {
      this.currentPage = 0
      this.total = 0
      this.pageSize = 10
      this.getTableData()
      if (this.selectDetailData.labelWay == '1') {
        this.dialogVisible = true
      } else if (this.selectDetailData.labelWay == '2') {
        this.dialogVisible2 = true
      }
    },
    replaceLabel() {
      this.handleException(this.replaceData, 5)
      this.replaceDialogVisible = false
    },
    onDialogClose() {
      this.getDetailTableData()
    },
    onDialogClose2() {
      this.getTableData()
    },
    goMap(row, column, event) {
      this.selectedMapId = row.equipmentId + ''
      this.mapDialogVisible = true
    }
  }
}
</script>

<style lang="scss" scoped>
.dd {
  text-align: center;
}
</style>
